Method, computer device, and non-transitory computer readable recording medium to display grouped image message

ABSTRACT

A method, a computer device, and a non-transitory computer-readable recording medium are provided to display a grouped image message. An image message display method may include displaying a plurality of grouped images sent and received as an image message in a chatroom as a single message unit; and switching a view mode of the image message in the chatroom in response to a user request.

CROSS-REFERENCE TO RELATED APPLICATION

This application claims priority from Korean Patent Application No.10-2021-0071870, filed Jun. 3, 2021 in the Korean Intellectual PropertyOffice (KIPO), the disclosure of which is incorporated herein byreference in its entirety.

BACKGROUND 1. Field

Apparatuses and methods consistent with example embodiments relate todisplaying a message in a chatroom.

2. Description of Related Art

An instant messenger is a general community tool for sending andreceiving messages or data in real time. The instant messenger may allowa user to register a contact on a messenger and to send and receivemessages with a counterpart included in a contact list.

Due to such a messenger function, the use of a messenger is popular notonly in a personal computer (PC) environment but also in a mobileenvironment of a mobile communication terminal.

SUMMARY

Example embodiments may provide a plurality of view modes for a messageconfigured as a bundle-processed image group.

Example embodiments may display an image message in a mode according toa user selection between a grid mode and a carousel mode without ascreen transition in a chatroom.

According to an aspect of at least one example embodiment, there isprovided an image message display method implemented by a computerdevice including at least one processor configured to executecomputer-readable instructions included in a memory, the image messagedisplay method including, by the at least one processor, displaying aplurality of grouped images sent and received as an image message in achatroom as a single message unit; and switching a view mode of theimage message in response to a user request.

The switching the view mode may include switching the view mode inresponse to the user request being received via a toggle buttonpresented in the chatroom.

The switching may include: toggling between a grid mode in which theplurality of grouped images are displayed in a grid form and a carouselmode in which the plurality of grouped images are scrollable in ahorizontal direction.

The grid mode is a view mode for displaying a thumbnail image, and thecarousel mode is a view mode for displaying an original image or anenlarged image of the thumbnail image.

The image message display method may further include: displaying theimage message in a default view mode between the grid mode and thecarousel mode in response to a user reentering the chatroom afterleaving the chatroom when the image message is displayed.

The image message display method may further include: storing a lastview mode displayed in the chatroom for the image message; anddisplaying the image message in the last view mode between the grid modeand the carousel mode in response to reentry into the chatroom.

In the carousel mode, a movement between the plurality of grouped imagesaccording to a user input is provided by horizontally arranging theplurality of grouped images.

In the carousel mode, the plurality of grouped images are scrolledregardless of an input size according to a user input.

In the carousel mode, the plurality of grouped images are scrolled inproportion to an input size according to a user input.

The image message display method may further include displaying, in thecarousel mode, a scroll indicator according to a movement between theplurality of grouped images.

According to an aspect of at least one example embodiment, there isprovided a non-transitory computer-readable recording medium storingcomputer-readable instructions that, when executed by a processor, causethe processor to perform the image message display method.

According to an aspect of at least one example embodiment, there isprovided a computer device including at least one memory storingcomputer-readable instructions; and at least one processor configured toexecute the computer-readable instructions to display a plurality ofgrouped images sent and received as an image message in a chatroom as asingle message unit, and to switch a view mode of the image message inresponse to a user request.

The at least one processor may be further configured to switch the viewmode in response to the user request being received via a toggle buttonpresented in the chatroom.

The at least one processor may be further configured to toggle between agrid mode in which the plurality of grouped images are displayed in agrid form and a carousel mode in which the plurality of grouped imagesare scrollable in a horizontal direction.

The grid mode is a view mode for displaying a thumbnail image, and thecarousel mode is a view mode for displaying an original image or anenlarged image of the thumbnail image.

The at least one processor may be further configured to display theimage message in a default view mode between the grid mode and thecarousel mode in response to a user entering the chatroom after leavingthe chatroom when the image message is displayed.

The at least one processor may be configured to: store a last view modedisplayed in the chatroom for the image message, and display the imagemessage in the last view mode between the grid mode and the carouselmode in response to reentry into the chatroom.

In the carousel mode, a movement between the plurality of grouped imagesaccording to a user input is provided by horizontally arranging theplurality of grouped images.

In the carousel mode, the plurality of grouped images are scrolled inproportion to an input size according to a user input.

The at least one processor may be further configured to execute thecomputer-readable instructions to display a scroll indicator accordingto a movement between the plurality of grouped images are in thecarousel mode.

BRIEF DESCRIPTION OF THE DRAWINGS

The above and/or other aspects will be more apparent by describingcertain example embodiments, with reference to the accompanyingdrawings, in which:

FIG. 1 is a diagram illustrating an example of a network environmentaccording to at least one example embodiment;

FIG. 2 is a diagram illustrating an example of a computer deviceaccording to at least one example embodiment;

FIG. 3 illustrates an example of a component includable in a processorof a computer device according to at least one example embodiment;

FIG. 4 is a flowchart illustrating an example of a method performed by acomputer device according to at least one example embodiment;

FIGS. 5 to 7 illustrate examples of an image message display processaccording to at least one example embodiment; and

FIGS. 8 and 9 illustrate examples of scrolling in a carousel mode of animage message according to at least one example embodiment.

It should be noted that these figures are intended to illustrate thegeneral characteristics of methods and/or structure utilized in certainexample embodiments and to supplement the written description providedbelow. These drawings are not, however, to scale and may not preciselyreflect the precise structural or performance characteristics of anygiven embodiment, and should not be interpreted as defining or limitingthe range of values or properties encompassed by example embodiments.

DETAILED DESCRIPTION

Example embodiments are described in greater detail below with referenceto the accompanying drawings.

In the following description, like drawing reference numerals are usedfor like elements, even in different drawings. The matters defined inthe description, such as detailed construction and elements, areprovided to assist in a comprehensive understanding of the exampleembodiments. However, it is apparent that the example embodiments can bepracticed without those specifically defined matters. Also, well-knownfunctions or constructions are not described in detail since they wouldobscure the description with unnecessary detail.

One or more example embodiments will be described in detail withreference to the accompanying drawings. Example embodiments, however,may be embodied in various different forms, and should not be construedas being limited to only the illustrated embodiments. Rather, theillustrated embodiments are provided as examples so that this disclosurewill be thorough and complete, and will fully convey the concepts ofthis disclosure to those skilled in the art. Accordingly, knownprocesses, elements, and techniques, may not be described with respectto some example embodiments. Unless otherwise noted, like referencecharacters denote like elements throughout the attached drawings andwritten description, and thus descriptions will not be repeated.

Although the terms “first,” “second,” “third,” etc., may be used hereinto describe various elements, components, regions, layers, and/orsections, these elements, components, regions, layers, and/or sections,should not be limited by these terms. These terms are only used todistinguish one element, component, region, layer, or section, fromanother region, layer, or section. Thus, a first element, component,region, layer, or section, discussed below may be termed a secondelement, component, region, layer, or section, without departing fromthe scope of this disclosure.

Spatially relative terms, such as “beneath,” “below,” “lower,” “under,”“above,” “upper,” and the like, may be used herein for ease ofdescription to describe one element or feature's relationship to anotherelement(s) or feature(s) as illustrated in the figures. It will beunderstood that the spatially relative terms are intended to encompassdifferent orientations of the device in use or operation in addition tothe orientation depicted in the figures. For example, if the device inthe figures is turned over, elements described as “below,” “beneath,” or“under,” other elements or features would then be oriented “above” theother elements or features. Thus, the example terms “below” and “under”may encompass both an orientation of above and below. The device may beotherwise oriented (rotated 90 degrees or at other orientations) and thespatially relative descriptors used herein interpreted accordingly. Inaddition, when an element is referred to as being “between” twoelements, the element may be the only element between the two elements,or one or more other intervening elements may be present.

As used herein, the singular forms “a,” “an,” and “the,” are intended toinclude the plural forms as well, unless the context clearly indicatesotherwise. It will be further understood that the terms “comprises”and/or “comprising,” when used in this specification, specify thepresence of stated features, integers, steps, operations, elements,and/or components, but do not preclude the presence or addition of oneor more other features, integers, steps, operations, elements,components, and/or groups, thereof. As used herein, the term “and/or”includes any and all combinations of one or more of the associatedlisted products. Expressions such as “at least one of,” when preceding alist of elements, modify the entire list of elements and do not modifythe individual elements of the list. For example, the expression, “atleast one of a, b, and c,” should be understood as including only a,only b, only c, both a and b, both a and c, both b and c, all of a, b,and c, or any variations of the aforementioned examples. Also, the term“exemplary” is intended to refer to an example or illustration.

When an element is referred to as being “on,” “connected to,” “coupledto,” or “adjacent to,” another element, the element may be directly on,connected to, coupled to, or adjacent to, the other element, or one ormore other intervening elements may be present. In contrast, when anelement is referred to as being “directly on,” “directly connected to,”“directly coupled to,” or “immediately adjacent to,” another elementthere are no intervening elements present.

Unless otherwise defined, all terms (including technical and scientificterms) used herein have the same meaning as commonly understood by oneof ordinary skill in the art to which example embodiments belong. Terms,such as those defined in commonly used dictionaries, should beinterpreted as having a meaning that is consistent with their meaning inthe context of the relevant art and/or this disclosure, and should notbe interpreted in an idealized or overly formal sense unless expresslyso defined herein.

Example embodiments may be described with reference to acts and symbolicrepresentations of operations (e.g., in the form of flow charts, flowdiagrams, data flow diagrams, structure diagrams, block diagrams, etc.)that may be implemented in conjunction with units and/or devicesdiscussed in more detail below. Although discussed in a particularmanner, a function or operation specified in a specific block may beperformed differently from the flow specified in a flowchart, flowdiagram, etc. For example, functions or operations illustrated as beingperformed serially in two consecutive blocks may actually be performedsimultaneously, or in some cases be performed in reverse order.

Units and/or devices according to one or more example embodiments may beimplemented using hardware and/or a combination of hardware andsoftware. For example, hardware devices may be implemented usingprocessing circuitry such as, but not limited to, a processor, CentralProcessing Unit (CPU), a controller, an arithmetic logic unit (ALU), adigital signal processor, a microcomputer, a field programmable gatearray (FPGA), a System-on-Chip (SoC), a programmable logic unit, amicroprocessor, or any other device capable of responding to andexecuting instructions in a defined manner.

Software may include a computer program, program code, instructions, orsome combination thereof, for independently or collectively instructingor configuring a hardware device to operate as desired. The computerprogram and/or program code may include program or computer-readableinstructions, software components, software modules, data files, datastructures, and/or the like, capable of being implemented by one or morehardware devices, such as one or more of the hardware devices mentionedabove. Examples of program code include both machine code produced by acompiler and higher level program code that is executed using aninterpreter.

For example, when a hardware device is a computer processing device(e.g., a processor), Central Processing Unit (CPU), a controller, anarithmetic logic unit (ALU), a digital signal processor, amicrocomputer, a microprocessor, etc., the computer processing devicemay be configured to carry out program code by performing arithmetical,logical, and input/output operations, according to the program code.Once the program code is loaded into a computer processing device, thecomputer processing device may be programmed to perform the programcode, thereby transforming the computer processing device into a specialpurpose computer processing device. In a more specific example, when theprogram code is loaded into a processor, the processor becomesprogrammed to perform the program code and operations correspondingthereto, thereby transforming the processor into a special purposeprocessor.

Software and/or data may be embodied permanently or temporarily in anytype of machine, component, physical or virtual equipment, or computerrecording medium or device, capable of providing instructions or datato, or being interpreted by, a hardware device. The software also may bedistributed over network coupled computer systems so that the softwareis stored and executed in a distributed fashion. In particular, forexample, software and data may be stored by one or more computerreadable recording mediums, including the tangible or non-transitorycomputer-readable storage media discussed herein.

According to one or more example embodiments, computer processingdevices may be described as including various functional units thatperform various operations and/or functions to increase the clarity ofthe description. However, computer processing devices are not intendedto be limited to these functional units. For example, in one or moreexample embodiments, the various operations and/or functions of thefunctional units may be performed by other ones of the functional units.Further, the computer processing devices may perform the operationsand/or functions of the various functional units without sub-dividingthe operations and/or functions of the computer processing units intothese various functional units.

Units and/or devices according to one or more example embodiments mayalso include one or more storage devices. The one or more storagedevices may be tangible or non-transitory computer-readable storagemedia, such as random access memory (RAM), read only memory (ROM), apermanent mass storage device (such as a disk drive, solid state (e.g.,NAND flash) device, and/or any other like data storage mechanism capableof storing and recording data. The one or more storage devices may beconfigured to store computer programs, program code, instructions, orsome combination thereof, for one or more operating systems and/or forimplementing the example embodiments described herein. The computerprograms, program code, instructions, or some combination thereof, mayalso be loaded from a separate computer readable recording medium intothe one or more storage devices and/or one or more computer processingdevices using a drive mechanism. Such separate computer readablerecording medium may include a Universal Serial Bus (USB) flash drive, amemory stick, a Blu-ray/DVD/CD-ROM drive, a memory card, and/or otherlike computer readable storage media. The computer programs, programcode, instructions, or some combination thereof, may be loaded into theone or more storage devices and/or the one or more computer processingdevices from a remote data storage device via a network interface,rather than via a local computer readable recording medium.Additionally, the computer programs, program code, instructions, or somecombination thereof, may be loaded into the one or more storage devicesand/or the one or more processors from a remote computing system that isconfigured to forward and/or distribute the computer programs, programcode, instructions, or some combination thereof, over a network. Theremote computing system may forward and/or distribute the computerprograms, program code, instructions, or some combination thereof, via awired interface, an air interface, and/or any other like medium.

The one or more hardware devices, the one or more storage devices,and/or the computer programs, program code, instructions, or somecombination thereof, may be specially designed and constructed for thepurposes of the example embodiments, or they may be known devices thatare altered and/or modified for the purposes of example embodiments.

A hardware device, such as a computer processing device, may run anoperating system (OS) and one or more software applications that run onthe OS. The computer processing device also may access, store,manipulate, process, and create data in response to execution of thesoftware. For simplicity, one or more example embodiments may beexemplified as one computer processing device; however, one skilled inthe art will appreciate that a hardware device may include multipleprocessing elements and multiple types of processing elements. Forexample, a hardware device may include multiple processors or aprocessor and a controller. In addition, other processing configurationsare possible, such as parallel processors.

Although described with reference to specific examples and drawings,modifications, additions and substitutions of example embodiments may bevariously made according to the description by those of ordinary skillin the art. For example, the described techniques may be performed in anorder different with that of the methods described, and/or componentssuch as the described system, architecture, devices, circuit, and thelike, may be connected or combined to be different from theabove-described methods, or results may be appropriately achieved byother components or equivalents.

Hereinafter, example embodiments will be described with reference to theaccompanying drawings.

The example embodiments relate to displaying a message in a chatroom.

The example embodiments may provide a plurality of view modes for animage message in a chatroom.

The term “image message” used herein refers to a message correspondingto a single image type among message types that may be sent through amessenger and the like. In particular, in the example embodiment, theimage message refers to a message in which at least two messages (e.g.,photos) are grouped through bundle processing and regarded as a singletransmission unit or a single transmission packet and displayed througha single message user interface (UI) (e.g., a speech bubble).

Although the example embodiment describes an image as content that maybe sent as a message, it is provided as an example only. In addition tothe image, content to be sent may be bundled or grouped as a singletransmission unit. Any types of contents that may be displayed through asingle message UI may be expanded and applied.

An image message display system according to some example embodimentsmay be implemented by at least one computer device. An image messagedisplay method according to some example embodiments may be performed byat least one computer device included in the image message displaysystem. Here, a computer program according to an example embodiment maybe installed and run on the computer device and the computer device mayperform the image message display method according to exampleembodiments under control of the computer program. The aforementionedcomputer program may be stored in a computer-readable recording mediumto implement the image message display method in conjunction with thecomputer device.

FIG. 1 illustrates an example of a network environment according to atleast one example embodiment. Referring to FIG. 1 , the networkenvironment may include a plurality of electronic devices 110, 120, 130,and 140, a plurality of servers 150 and 160, and a network 170. FIG. 1is provided as an example only. A number of electronic devices or anumber of servers is not limited thereto. Also, the network environmentof FIG. 1 is provided as one example of environments applicable to theexample embodiments and an environment applicable to the exampleembodiments is not limited to the network environment of FIG. 1 .

Each of the plurality of electronic devices 110, 120, 130, and 140 maybe a fixed terminal or a mobile terminal that is configured as acomputer device. For example, the plurality of electronic devices 110,120, 130, and 140 may be a smartphone, a mobile phone, a navigationdevice, a computer, a laptop computer, a digital broadcasting terminal,a personal digital assistant (PDA), a portable multimedia player (PMP),a tablet PC, and the like. For example, although FIG. 1 illustrates ashape of a smartphone as an example of the electronic device 110, theelectronic device 110 used herein may refer to one of various types ofphysical computer devices capable of communicating with other electronicdevices 120, 130, and 140, and/or the servers 150 and 160 over thenetwork 170 in a wireless or wired communication manner.

The communication scheme is not limited and may include a near fieldwireless communication scheme between devices as well as a communicationscheme using a communication network (e.g., a mobile communicationnetwork, wired Internet, wireless Internet, and a broadcasting network.)includable in the network 170. For example, the network 170 may includeat least one of network topologies that include a personal area network(PAN), a local area network (LAN), a campus area network (CAN), ametropolitan area network (MAN), a wide area network (WAN), a broadbandnetwork (BBN), and the Internet. Also, the network 170 may include atleast one of network topologies that include a bus network, a starnetwork, a ring network, a mesh network, a star-bus network, a tree orhierarchical network, and the like. However, they are provided asexamples only.

Each of the servers 150 and 160 may be configured as a computer deviceor a plurality of computer devices that provides an instruction, a code,a file, content, a service, etc., through communication with theplurality of electronic devices 110, 120, 130, and 140 over the network170. For example, the server 150 may be a system that provides a service(e.g., a messenger service) to the plurality of electronic devices 110,120, 130, and 140 connected over the network 170.

FIG. 2 is a block diagram illustrating an example of a computer deviceaccording to at least one example embodiment. Each of the plurality ofelectronic devices 110, 120, 130, and 140 or each of the servers 150 and160 may be implemented by a computer device 200 of FIG. 2 .

Referring to FIG. 2 , the computer device 200 may include a memory 210,a processor 220, a communication interface 230, and an input/output(I/O) interface 240. The memory 210 may include a permanent mass storagedevice, such as a random access memory (RAM), a read only memory (ROM),and a disk drive, as a non-transitory computer-readable recordingmedium. The permanent mass storage device, such as ROM and a disk drive,may be included in the computer device 200 as a permanent storage deviceseparate from the memory 210. Also, an OS and at least one program codemay be stored in the memory 210. Such software components may be loadedto the memory 210 from another non-transitory computer-readablerecording medium separate from the memory 210. The other non-transitorycomputer-readable recording medium may include a non-transitorycomputer-readable recording medium, for example, a floppy drive, a disk,a tape, a DVD/CD-ROM drive, a memory card, etc. According to otherexample embodiments, software components may be loaded to the memory 210through the communication interface 230, instead of the non-transitorycomputer-readable recording medium. For example, the software componentsmay be loaded to the memory 210 of the computer device 200 based on acomputer program installed by files received over the network 170.

The processor 220 may be configured to process instructions of acomputer program by performing basic arithmetic operations, logicoperations, and I/O operations. The computer-readable instructions maybe provided by the memory 210 or the communication interface 230 to theprocessor 220. For example, the processor 220 may be configured toexecute received instructions in response to a program code stored in astorage device, such as the memory 210.

The communication interface 230 may provide a function or a hardwarestructure for communication between the computer device 200 and anotherapparatus, for example, the aforementioned storage devices. For example,the processor 220 of the computer device 200 may forward a request or aninstruction created based on a program code stored in the storage devicesuch as the memory 210, data, and a file, to other apparatuses over thenetwork 170 under control of the communication interface 230. Inversely,a signal, an instruction, data, a file, etc., from another apparatus maybe received at the computer device 200 through the communicationinterface 230 of the computer device 200. For example, a signal, aninstruction, data, etc., received through the communication interface230 may be forwarded to the processor 220 or the memory 210, and a file,etc., may be stored in a storage medium, for example, the permanentstorage device, further includable in the computer device 200.

The I/O interface 240 may be a device used for interfacing with an I/Oapparatus 250. For example, an input device may include a device, suchas a microphone, a keyboard, a mouse, etc., and an output device mayinclude a device, such as a display, a speaker, etc. As another example,the I/O interface 240 may be a device for interfacing with an apparatusin which an input function and an output function are integrated into asingle function, such as a touchscreen. The I/O apparatus 250 may beconfigured as a single apparatus with the computer device 200.

Also, according to other example embodiments, the computer device 200may include a greater or smaller number of components than the number ofcomponents of FIG. 2 . However, there is no need to clearly illustratemost conventional components. For example, the computer device 200 maybe configured to include at least a portion of the I/O apparatus 250 ormay further include other components, such as a transceiver and adatabase.

Hereinafter, a method and apparatus that may display an image message ina chatroom according to example embodiments will be described.

FIG. 3 is a diagram illustrating an example of components included in aprocessor of a computer device according to at least one exampleembodiment, and FIG. 4 is a flowchart illustrating an example of animage message display method performed by a computer device according toat least one example embodiment.

The computer device 200 according to the example embodiment may providea messenger service through connection to an exclusive application or awebsite/mobile site. An image message display system implemented as acomputer may be configured in the computer device 200. For example, theimage message display system may be implemented in a form of a programthat independently operates or may be configured in an in-app form of aspecific application to be operable on the specific application.

Referring to FIG. 3 , the processor 220 of the computer device 200 mayinclude a message processing component 310 and a message displaycomponent 320 as components to perform the following image messagedisplay method. Depending on example embodiments, components of theprocessor 220 may be selectively included in or excluded from theprocessor 220. Also, depending on example embodiments, the components ofthe processor 220 may be separated or merged for functionalrepresentation of the processor 220.

The processor 220 and the components of the processor 220 may controlthe computer device 200 to perform operations included in the followingimage message display method. For example, the processor 220 and thecomponents of the processor 220 may be configured to execute aninstruction according to a code of at least one program and a code of anOS included in the memory 210.

Here, the components of the processor 220 may be representations ofdifferent functions performed by the processor 220 in response to one ormore instructions provided from a program code stored in the computerdevice 200. For example, the message processing component 310 may beused as a functional representation of the processor 220 that controlsthe computer device 200 to process transmission and reception of animage message through the chatroom in response to the instruction.

The processor 220 may read instructions for controlling the computerdevice 200 from the memory 210. In this case, the read instructions mayinclude an instruction for controlling the processor 220 to perform thefollowing image message display method.

Operations included in the following image message display method may beperformed in order different from illustrated order. A portion of theoperations may be omitted or an additional process may be furtherincluded.

Operations included in the following image message display method may beperformed by a client device (e.g., an electronic device 110, 120, 130,or 140) in which a messenger is installed. Depending on exampleembodiments, a portion of operations may be performed by the server 150.

Referring to FIG. 4 , in operation S410, the message processingcomponent 310 may perform message sending or receiving process, todisplay an outgoing or incoming image message through a chatroom. When auser participating in the chatroom desires to send a plurality of imagesin a batch in the corresponding chatroom, a client device may group theplurality of images through a bundling function and may send theplurality of images as a single message unit. A receiving side clientdevice may receive the plurality of images in a form that is grouped asa single message unit through the chatroom. When sending a message, thatis, an image message that includes the plurality of images to anelectronic device of each of users participating in the chatroom, theserver 150 may also deliver an original image file received from asending side client device with a thumbnail of each image. The receivingside client device may download the original image file from the server150 in a background. Here, whether to download the original image filemay be determined according to a predetermined condition, for example, anetwork environment or a setting option of the client device. Forexample, in a WiFi connection state, the original image file may beautomatically received at an incoming point in time of the imagemessage.

In operation S420, when displaying the image message in the chatroom,the message display component 320 may display the plurality of imagesincluded in the image message as a single message unit. The term “singlemessage unit” may refer to a single chat bubble, a single text message,a single image message, or a group of images which is selectable by asingle click or a single input (for example, to display a larger size ofthe group of images) in the chatroom. The message display component 320may display the plurality of images created as an image message typethrough a single message UI (e.g., a speech balloon). In an initialstage of initially displaying the image message in the chatroom, a viewmode of the image message may be displayed as a grid mode. In the gridmode, a corresponding UI layout is configured in a grid form whendisplaying the image message through a single message UI and a thumbnailof each image is arranged and displayed in the grid form.

In operation S430, in response to an input of a user request forswitching a view mode for the image message, the message displaycomponent 320 may switch and display the view mode of the image messagethrough a toggling function of switching between a grid mode and acarousel mode according to the user request. In the carousel mode, amessage with multiple images or videos may be viewed by swiping orclicking a preset position (e.g., a left or right side) or a presetbutton (e.g. an arrow button) to scroll the multiple images or videos ina horizontal direction. By arranging and displaying thumbnails in a gridform in the grid mode and by horizontally arranging not thumbnails ofimages but an original image file, a movement between images may beprovided through a predetermined type of input (e.g., a swipe action).Depending on example embodiments, for example, in an environment inwhich an original image file is not received at a client device, it ispossible to implement the carousel mode by enlarging a thumbnail to afixed size. When a view mode change request is input in a state in whichthe image message is displayed in the grid mode, the message displaycomponent 320 may switch a view mode of the corresponding image messagefrom the grid mode to the carousel mode. When a view mode change requestis input in a state in which the image message is displayed in thecarousel mode, the message display component 320 may switch the viewmode of the corresponding image message from the carousel mode to thegrid mode. Here, the message display component 320 may provide viewdetails for the image message without changing a screen through thecarousel mode and may display the image message in a view mode accordingto a user selection through a toggling method between the grid mode andthe carousel mode.

When an image grouped through bundle processing is displayed as a singlemessage unit, a size of a corresponding thumbnail is smaller than a sizeof images sent as individual messages. To verify an image included inthe image message, a method of entering a separate detail screen byselecting a corresponding thumbnail is used in the art. The exampleembodiment refers to a method of minimizing a screen transition withoutleaving a chatroom and may provide a detailed image by changing a viewmode of an image message.

FIGS. 5 to 7 illustrate examples of an image message display processaccording to at least one example embodiment.

FIGS. 5 to 7 illustrate a chatroom 500 of a messenger executed on aclient device that is an electronic device of a user.

Referring to FIG. 5 , when sending and receiving an image message 510including a plurality of grouped images through the chatroom 500, theprocessor 220 may display the image message 510 in a grid mode byconfiguring a layout of a message UI in a grid form and by arranging athumbnail of each image in a grid-form layout.

A toggle button 501 may be provided to allow a user to request to switcha view mode of the image message 510. The toggle button 501 may bepresented for view mode switching, and the user request may be performedthrough the toggle button 501. The toggle button 501 may operate as abutton to switch from the grid mode to a carousel mode, or from thecarousel mode to the grid mode.

In addition to the toggle button 501 for switching the view mode of theimage message 510, a share button 502 for sharing the image message 510may also be provided.

Referring to FIG. 6 , when a user clicks the toggle button 501 in astate in which the image message 510 is displayed in a grid mode, theprocessor 220 may switch a view mode of the image message 510 to acarousel mode. The processor 220 may display the image message 510 inthe carousel mode by configuring a layout of a message UI in a carouselform and by horizontally arranging an original image 611 (or an enlargedimage of a thumbnail) instead of the thumbnail.

Here, in a state in which the image message 510 is displayed in thecarousel mode, the toggle button 501 may operate as a button to switchfrom the carousel mode to the grid mode.

The user may verify the original images 611 as a detailed image of thethumbnail by simply changing a view mode of the image message 510without a screen transition.

Referring to FIG. 7 , in response to a user request for changing theview mode via the toggle button 501, the processor 220 may repeatedlyswitch between the grid mode and the carousel mode as the view mode ofthe image message 510.

In an initial stage of displaying the image message 510 immediatelyafter processing the image message 510 that is received or sent throughthe chatroom 500, or a user reenters the chatroom 500, the image message510 is displayed in a default view mode. A default for a view mode maybe defined according to system settings or may be determined accordingto user settings. For example, immediately after sending and receivingthe image message 510 or when the user leaves and then reenters thechatroom 500 in a state in which the view mode of the image message 510is set to the carousel mode, the image message 510 may be displayed inthe carousel mode.

As another example, a last view mode for the image message 510 may bestored and the image message 510 may be displayed by applying thecorresponding view mode in response to re-entry into the chatroom 500.Immediately after sending and receiving the image message 510, the imagemessage 510 may be displayed in the grid mode. In the case of storing alast view mode according to switching a view mode for each image message510 and then leaving and reentering the chatroom 500, the image message510 may be displayed in a previous last view mode.

In the case of the image message 510 included in the chatroom 500, thesame display method may apply to an outgoing message as well as anincoming message.

FIGS. 8 and 9 illustrate examples of scrolling in a carousel mode of animage message according to at least one example embodiment.

Referring to FIGS. 8 and 9 , when the image message 510 is displayed inthe carousel mode, a scroll indicator 812, 913 for a movement betweenthe original images 611 may be included in a carousel-form layout.

The processor 220 may show a degree of scrolling according to an imagedisplayed in a reference area among the entire images that belong to theimage message 510 through the scroll indicator 812, 913.

The processor 220 may provide a scroll function for the original images611 in response to a swipe action of the user. Here, every time a swipeaction is input, the processor 220 may scroll the original images 611one by one regardless of a size of a user input.

Depending on example embodiments, the processor 220 may scroll aplurality of original images 611 by applying an input size of a swipeaction.

Therefore, in the case of switching the view mode of the image message510 to the carousel mode, the processor 220 may provide view details forthe image message 510.

According to some example embodiments, it is possible to provide aplurality of view modes for a message including images grouped throughbatch processing and to display an image message in a mode according toa user selection between a grid mode and a carousel mode without ascreen transition in a chatroom.

The apparatuses described above may be implemented using hardwarecomponents, software components, and/or a combination of hardwarecomponents and software components. For example, the apparatuses and thecomponents described herein may be implemented using one or moregeneral-purpose or special purpose computers, for example, a processor,a controller, an arithmetic logic unit (ALU), a digital signalprocessor, a microcomputer, a field programmable gate array (FPGA), aprogrammable logic unit (PLU), a microprocessor, or any other devicecapable of responding to and executing instructions in a defined manner.The processing device may run an operating system (OS) and one or moresoftware applications that run on the OS. The processing device also mayaccess, store, manipulate, process, and create data in response toexecution of the software. For simplicity, the description of aprocessing device is used as singular; however, one skilled in the artwill be appreciated that the processing device may include multipleprocessing elements and/or multiple types of processing elements. Forexample, the processing device may include multiple processors or aprocessor and a controller. In addition, different processingconfigurations are possible, such as parallel processors.

The software may include a computer program, a piece of code, aninstruction, or some combinations thereof, for independently orcollectively instructing or configuring the processing device to operateas desired. Software and/or data may be embodied in any type of machine,component, physical equipment, a computer storage medium or device, orin a propagated signal wave capable of providing instructions or data toor being interpreted by the processing device. The software also may bedistributed over network coupled computer devices so that the softwareis stored and executed in a distributed fashion. The software and datamay be stored by one or more computer readable storage mediums.

The methods according to some example embodiments may be configured in aform of program instructions performed through various computer methodsand recorded in non-transitory computer-readable media. The media maycontinuously store computer-executable programs or may temporarily storethe same for execution or download. Also, the media may be various typesof recording devices or storage devices in a form in which one or aplurality of hardware components are combined. Without being limited tomedia directly connected to a computer system, the media may bedistributed over the network. Examples of the media include magneticmedia such as hard disks, floppy disks, and magnetic tapes; opticalmedia such as CD-ROM and DVDs; magneto-optical media such as flopticaldisks; and hardware devices that are specially configured to store andperform program instructions, such as ROM, RAM, flash memory, and thelike. Examples of other media may include recording media and storagemedia managed by an app store that distributes applications or a site, aserver, and the like that supplies and distributes other various typesof software.

The foregoing embodiments are merely examples and are not to beconstrued as limiting. The present teaching can be readily applied toother types of apparatuses. Also, the description of the exemplaryembodiments is intended to be illustrative, and not to limit the scopeof the claims, and many alternatives, modifications, and variations willbe apparent to those skilled in the art.

What is claimed is:
 1. An image message display method implemented by a computer device comprising at least one processor configured to execute computer-readable instructions included in a memory, the image message display method comprising: displaying a plurality of grouped images sent and received as an image message in a chatroom as a single message unit in one mode of a grid mode in which the plurality of grouped images are displayed in a grid form with rows and columns and a carousel mode in which the plurality of grouped images are scrollable in a horizontal direction; and switching a view mode of the image message between the grid mode and the carousel mode in response to a user request, wherein the switching comprises: displaying a toggle button in association with the grouped images in the chatroom for toggling between the grid mode and the carousel mode, the toggle button being a first shape, and in response to the user request being received via the toggle button, switching said one mode of the grid mode and the carousel mode to the other mode of the grid mode and the carousel mode and changing the first shape of the toggle button to a second shape of the toggle button.
 2. The image message display method of claim 1, wherein the first shape corresponds to the other mode of the grid mode and the carousel mode, and the second shape corresponds to the one mode of the grid mode and the carousel mode.
 3. The image message display method of claim 1, wherein an entire portion of each of the plurality of grouped images is shown in the grid mode.
 4. The image message display method of claim 1, wherein the grid mode is a view mode for displaying thumbnail images of the plurality of grouped images in the rows and columns, and the carousel mode is a view mode for displaying original images of the plurality of grouped images or enlarged images of the thumbnail images.
 5. The image message display method of claim 1, further comprising: displaying the image message in a default view mode between the grid mode and the carousel mode in response to a user reentering the chatroom after leaving the chatroom when the image message is displayed.
 6. The image message display method of claim 1, further comprising: storing a last view mode displayed in the chatroom for the image message; and displaying the image message in the last view mode between the grid mode and the carousel mode in response to reentry into the chatroom.
 7. The image message display method of claim 1, wherein, in the carousel mode, a movement between the plurality of grouped images according to a user input is provided by horizontally arranging the plurality of grouped images.
 8. The image message display method of claim 1, wherein, in the carousel mode, the plurality of grouped images are scrolled regardless of an input size according to a user input.
 9. The image message display method of claim 1, wherein, in the carousel mode, the plurality of grouped images are scrolled in proportion to an input size according to a user input.
 10. The image message display method of claim 1, further comprising: displaying, in the carousel mode, a scroll indicator according to a movement between the plurality of grouped images.
 11. A non-transitory computer-readable recording medium storing computer-readable instructions that, when executed by at least one processor, cause the at least one processor to perform an image message display method comprising: displaying a plurality of grouped images sent and received as an image message in a chatroom as a single message unit in one mode of a grid mode in which the plurality of grouped images are displayed in a grid form with rows and columns and a carousel mode in which the plurality of grouped images are scrollable in a horizontal direction; and switching a view mode of the image message between the grid mode and the carousel mode in response to a user request, wherein the switching comprises: displaying a toggle button in association with the grouped images in the chatroom for toggling between the grid mode and the carousel mode, the toggle button being a first shape, and in response to the user request being received via the toggle button, switching said one mode of the grid mode and the carousel mode to the other mode of the grid mode and the carousel mode and changing the first shape of the toggle button to a second shape of the toggle button.
 12. A computer device comprising: at least one memory storing computer-readable instructions; and at least one processor configured to execute the computer-readable instructions to: display a plurality of grouped images sent and received as an image message in a chatroom as a single message unit in one mode of a grid mode in which the plurality of grouped images are displayed in a grid form with rows and columns and a carousel mode in which the plurality of grouped images are scrollable in a horizontal direction, and switch a view mode of the image message between the grid mode and the carousel mode in response to a user request, wherein the at least one processor is further configured to display a toggle button in association with the grouped images in the chatroom for toggling between the grid mode and the carousel mode, the toggle button being a first shape, and in response to the user request being received via the toggle button, switch said one mode of the grid mode and the carousel mode to the other mode of the grid mode and the carousel mode and change the first shape of the toggle button to a second shape of the toggle button.
 13. The computer device of claim 12, wherein the first shape corresponds to the other mode of the grid mode and the carousel mode, and the second shape corresponds to the one mode of the grid mode and the carousel mode.
 14. The computer device of claim 12, wherein an entire portion of each of the plurality of grouped images is shown in the grid mode.
 15. The computer device of claim 12, wherein the grid mode is a view mode for displaying thumbnail images of the plurality of grouped images, and the carousel mode is a view mode for displaying original images of the plurality of grouped images in the rows and columns or enlarged images of the thumbnail images.
 16. The computer device of claim 12, wherein the at least one processor is further configured to display the image message in a default view mode between the grid mode and the carousel mode in response to a user entering the chatroom after leaving the chatroom when the image message is displayed.
 17. The computer device of claim 12, wherein the at least one processor is configured to: store a last view mode displayed in the chatroom for the image message, and display the image message in the last view mode between the grid mode and the carousel mode in response to reentry into the chatroom.
 18. The computer device of claim 12, wherein, in the carousel mode, a movement between the plurality of grouped images according to a user input is provided by horizontally arranging the plurality of grouped images.
 19. The computer device of claim 12, wherein, in the carousel mode, the plurality of grouped images are scrolled in proportion to an input size according to a user input.
 20. The computer device of claim 12, wherein the at least one processor is further configured to execute the computer-readable instructions to display a scroll indicator according to a movement between the plurality of grouped images are in the carousel mode. 